<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>欢迎页面</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<script src="/style/public/publicStyle.js"></script>
		<script src="/style/echarts/echarts.min.js"></script>
		<script src="/style/echarts/ecstat/ecStat.min.js"></script><!-- 工具条js -->
		<script src="/style/echarts/echarts.tool.js"></script>

	</head>
	<body>
<div class="layui-row" style="margin-top: 25px">
	<div class="layui-col-md6">
		<div class="layui-row">
			<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
				<legend>30天定时任务执行统计</legend>
			</fieldset>
			<div id="jobExec" class="echarts" style="width: 100%;height: 400px"></div>
		</div>
		<div class="layui-row">
			<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
				<legend>待处理消息</legend>
			</fieldset>
			<div id="msg" class="echarts" style="width: 100%;height: 400px"></div>
		</div>
	</div>
	<div class="layui-col-md6">
		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
			<legend>系统待处理异常</legend>
		</fieldset>
		<table class="layui-hide" id="tableDataList" lay-filter="tableDataList"></table>
	</div>
</div>
<div class="layui-row">
	<div class="layui-col-md6">

	</div>
	<div class="layui-col-md6">
	</div>
</div>
	</body>
</html>

<script>
	layui.use(['dropdown', 'util', 'laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element'], function () {
		var $ = layui.jquery
				, layer = layui.layer //弹层
				, table = layui.table //表格
				, element = layui.element;
		table.render({
			elem: '#tableDataList'
			, even: true //开启隔行背景
			, cellMinWidth: 80
			, toolbar: ''
			, url: '/med/baseErrlog/findByPage'
			, cols: [[
				, {field: 'idErrlog', title: 'ID', hide: true}
				, {field: 'dtSysCre', title: '发生时间',width:170, templet: '<div>{{layui.util.toDateString(d.handleTime, \'yyyy-MM-dd HH:mm:ss\')}}</div>'}
				, {field: 'level', title: '日志级别',width:100}
				, {field: 'msg', title: '日志描述'}
			]],
			done: {}
			, page: true
		});
	});
	var option = {
		color: [
			'#1E9FFF',
			'#FF5722',
			'#393D49',
			'#FFB800'
		],
		xAxis: {
			type: 'category',
			data: ['01-01','01-02','01-03','01-04','01-05','01-06','01-07','01-08','01-09','01-10','01-11','01-12','01-24', '01-25', '01-26']
		},
		tooltip: {
			trigger: 'axis'
		},
		legend: {
			data: ['job1', 'job2', 'job3']
		},
		yAxis: {
			type: 'value'
		},
		series: [
			{
				name:'job1',
				data: [0, 0,0,0, 0, 1,1, 0, 0,1, 0, 1,1, 1, 1],
				type: 'line'
			},
			{
				name:'job2',
				data: [0, 1,0,3, 0, 1,4, 0, 0,1, 0, 1,4, 3, 6],
				type: 'line'
			},
			{
				name:'job3',
				data: [10, 20,30,30, 30, 21,21, 0, 0,1, 0, 11,31, 21, 1],
				type: 'line'
			}
		]
	};
	pieOption = {
		series: [
			{
				type: 'pie',
				title:{text:'待处理消息'},
				legend: {
					data: ['错误日志', '元数据异常', '定时任务异常','新增维度数据提醒']
				},
				data: [
					{
						value: 12,
						name: '错误日志'
					},
					{
						value: 1,
						name: '元数据异常'
					},
					{
						value: 3,
						name: '定时任务异常'
					},
					{
						value: 3,
						name: '新增维度数据提醒'
					}
				]
			}
		]
	};
	// console.log(echarts);
	var echartsInstance=echarts.init(document.getElementById('jobExec'));
	//使用echarts对想象的init方法，创建一个二charts实例
	echartsInstance.setOption(option);
	var echartsInstance=echarts.init(document.getElementById('msg'));
	//使用echarts对想象的init方法，创建一个二charts实例
	echartsInstance.setOption(pieOption);
</script>